<template>
	<view v-show="types" class="pages">
		<view class="nav1">货主：{{uinfo.hzdwid}}</view>
		<view class="nav2">
			<view class="nav3">常用车队：</view>
			<view class="nav3">
				<view class="nav4" @click="addhzsqcd()">增加</view>
				<view class="nav4" style="background-color: #c03036;margin-left: 30px;" @click="qx()">删除</view>
			</view>
		</view>
		<view class="nav5">
			  <view class="nav"  :class="{atvxz:cur==item.cdid}"  @click="xz(item)" v-for="(item,index) in sqcdlist"  >
				{{item.cdname}}
				<!-- <view  class="nav6"  @click="delsqlh(item)">删除</view> -->
				</view>
		</view>
		<view v-show="zjcd" class="ck" style="border: 1px solid #3c77b7;">
			<view style="padding: 10px;margin-bottom: 10px; background-color: #3c77b7;overflow: hidden;">
				<view style="float: right;padding: 3px;font-size: 20px;color: #ffffff;font-weight: 600;" @click="guanb">关闭</view>
			</view>
			<view style="width: 100%;overflow: hidden;margin-bottom: 10upx;">
					<view style="float: left;height: 30px;line-height: 30px;font-size: 20px;width: 28%;text-align: center;">车队名称：</view>
					<view style="float: left;height: 30px;border-bottom: 1upx solid;width: 40%;" >
						<input style="font-size: 20px;height: 30px;" type="text" v-model="cdname"/>
					</view>
					<view class="cx" @click="getclistall">查询</view>
			</view>
			<view style="overflow:auto;height: 300px;">
				<view class="lv" :class="{atvxz:cur1==item.id}"  @click="xzcd(item)" v-for="(item,index) in items" >{{item.cdname}}</view>
			</view>
			<view class="lv" style="background-color: #3c77b7;margin-bottom: 3px;color: #ffffff;"  @click="addcd()">授权</view>
		</view>
	</view>
</template>
<script>
	export default {
		name:"hzdatas",
		props: {
			types: {
				type: Boolean,
				default: false,
				required: true
			},
			uid:{
				type: String
			}
		},
		data() {
			return {
				uinfo:'',
				sqcdlist:[],
				cur:'',
				zjcd:false,
				cdname:'',
				items: [],
				cur1:'',
				cdinfo:'',
				cdinfos:'',
			};
		},
		created(){
				this.getuserinfo(); 
				// this.getcstimeopendel();
				// this.gethzbdsqcdlist();
		},
		methods: {
			xz(e){
				   this.cur = e.cdid
				   this.cdinfos = e
			},
			xzcd(e){
					this.cur1= e.id
					this.cdinfo = e;
			},
			
			async addcd(){
				let data = {
					uid:uni.getStorageSync('uid'),
					cdidall:this.cdinfo.id
				}
				//获取全部选中项
				let res =  await this.$api.addhzcycdlist(data);
				console.log(res.data)
				if(res.data.code==0){
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:'车队'+this.cdinfo.cdname+'被添加到货主'+this.uinfo.hzdwid+'常用车队',
						lv:1,
						type:5,
						cz:JSON.stringify(this.cdinfo)
					}	
					await this.$api.addlogs(data1)
					this.zjcd = false
					this.gethzbdsqcdlist();
				}else{
					uni.showToast({
					  title: res.data.msg,	
					  icon:'none',
					  duration: 2000
					});
					return false;
				}
			},
			async getcstimeopendel(){
				let res =  await this.$api.getcstimeopendel();
				console.log(res)
			},
			async getclistall(){
				let data = {
					cdname:this.cdname
				}
				let res =  await this.$api.getclistall(data)
				if(res.data.code==0){
					this.items = res.data.data
				}
			},
			
			
			qx(e){
				let that = this
				uni.showModal({
					title: '是否取消当前授权车队',
					content: '取消授权',
					success: function (res) {
						if (res.confirm) {
							that.delsqlh(e)
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});	
			},
			
			
			async delsqlh(e){
				if(this.cur==''){
					uni.showToast({
					  title: '没有选择数据',	
					  icon:'none',
					  duration: 2000
					});
					return false;
				}
				let data = {
					hzname:this.uinfo.hzdwid,
					cdid:this.cur
				}
				let res =  await this.$api.dellhsqcd(data)
				console.log(res.data.code)
				if(res.data.code==0){
					let data1 = {
						uid:uni.getStorageSync('uid'),
						msg:'车队'+this.cdinfos.cdname+'被货主'+this.uinfo.hzdwid+'从常用车队删除',
						lv:1,
						type:5,
						cz:JSON.stringify(this.cdinfos)
					}	
					await this.$api.addlogs(data1)
						this.gethzbdsqcdlist();
				}else{
					uni.showToast({
					  title: res.data.msg,	
					  icon:'none',
					  duration: 2000
					});
				}
			},
			addhzsqcd(){
				// uni.navigateTo({
				// 	url:'/pages/addhzsqcd/addhzsqcd'
				// })
				this.zjcd = true
				this.getclistall();
			},
			guanb(){
				this.zjcd = false
			},
			async gethzbdsqcdlist(){
				let data = {
					// uid:uni.getStorageSync('uid')
					uid:this.uid
				}
				let res = await this.$api.gethzbdsqcdlist(data)
				console.log(res.data);
				this.sqcdlist = res.data.data
			},
			async getuserinfo(){
				let data = {
					id:this.uid
				}
				let res =  await this.$api.getuserinfo(data)
				console.log(res.data.code)
				if(res.data.code==0){
					this.uinfo = res.data.data
					uni.setStorageSync('uid', res.data.data.id);
					uni.setStorageSync('cdtype', res.data.data.cdtype);	
					if(res.data.data.cdtype==5){
						//进行委托单号状态更新
						this.getcstimeopendel();
						this.gethzbdsqcdlist();
					}
				}			
			}
		},
	}
</script>

<style lang="less" scoped>
	.pages{
		margin-top: 20px;
	}
	.nav1{
		height: 50px;
		line-height: 50px;
		padding-left: 10px;
		font-size: 20px;
		// font-weight: 600;
		color: #3c77b7;
	}
	.nav{
			width: 46%;
		    float: left;
		    border: 3px solid #3c77b7;
		    font-size: 20px;
		    height: 80px;
		    padding-top: 20px;
		    text-align: center;
		    word-wrap: break-word;
		    border-radius: 10px;
		    margin: 6px;
	}
	.atvxz{
		 background-color: #3c77b7;
		 color: #ffffff;
	}
	
	.nav2{
		height: 60px;
		font-size: 20px;
		padding-left: 10px;
	}
	.nav3{
		font-size: 20px;
		height: 60px;
		line-height: 60px;
		float: left;
		// font-weight: 600;
		color: #3c77b7;
	}
	.nav4{
		width: 70px;
		float:left;
		height: 40px;
		line-height: 40px;
		font-size: 18px;
		font-weight: 600;
		color: #ffffff;
		background-color: #3c77b7;
		margin-left: 10px;
		text-align: center;
		border-radius: 10px;
		margin-top: 10px;
	}
	.nav5{
		padding-left: 10px;	
		overflow: hidden;
	}
	.ck{
			z-index:999;
			-moz-opacity:1;
			opacity: 1;
			// border: 1px solid #000000;
			position: fixed;
			background-color: #ffffff;
			width: 90%;
			border-radius: 5px;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			//padding: 10upx;
		}
		.lv{
			height: 40px;
			line-height: 40px;
			text-align: center;
			font-size: 20px;
			border: 1px solid #3c77b7;
			width: 80%;
			margin: 10px auto;
			border-radius: 10px;
		}
		.cx{
			float: left;
			height: 30px;
			line-height: 30px;
			font-size: 20px;
			width: 20%;
			text-align: center;
			background-color: #3c77b7;
			border-radius: 10px;
			color: #ffffff;
			font-weight: 600;
			margin-left: 10px;
		}
</style>